{% extends "base.html" %}
{% load staticfiles %}
{% block title %} articles detail {% endblock %}
{% block contetnt %}
    <div class="container">
    <header>
        <h1>{{ article.title }}</h1>
        <p>{{ article.author.username }}</p>
    </header>
    <link rel="stylesheet" href="{% static 'editor/css/editormd.preview.css '%}}"/>
    <div id="editormd-view">
        <textarea id="append-test" style="display: none">
            {{ article.body }}
        </textarea>
    </div>
    </div>
    <script src="{% static 'js/jquery.js' %}"></script>
    <script src="{% static 'editor/lib/marked.min.js' %}"></script>
    <script src="{% static 'editor/lib/prettify.min.js' %}"></script>
    <script src="{% static 'editor/lib/raphael.min.js' %}"></script>
    <script src="{% static 'editor/lib/underscore.min.js' %}"></script>
    <script src="{% static 'sditor/lib/sequence-diagram.min.js' %}"></script>
    <script src="{% static 'editor/lib/flowchart.min.js' %}"></script>
    <script src="{% static 'editor/lib/jquery.flowchart.min.js' %}"></script>
    <script src="{% static 'editor/editormd.js' %}"></script>
    <script type="text/javascript">
    $(function(){
        editormd.markdownToHTML("editormd-view",{
            htmlDecode:"style,script,iframe",
            emoji:true,
            taskList:true,
            text:true,
            flowChart:true,
            sequenceDiagram:true,
        });
    });
    </script>
{% endblock %}